﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_Layout.cshtml";
}
@model TaoPortal.Areas.Admin.Models.ArticleModel
<ul class="breadcrumb" style="margin-bottom: 7px;">
    <li><a href="#">首页</a> <span class="divider">/</span></li>
    <li><a href="#">内容管理</a> <span class="divider">/</span></li>
    <li class="active">文章管理</li>
</ul>
<div class="row-fluid">
    <div class="span6">
        <div class="panel">
            <div class="panel-header clearfix">
                <h3 class="pull-left">文章分类</h3>
                <div class="pull-right" id="tbar">
                    <ul class="bui-bar button-group" id="bar8" role="toolbar" aria-disabled="false">
                    </ul>
                </div>
            </div>
            <div class="panel-body" id="ArtTree">
            </div>
        </div>
    </div>
    <div class="span18">
        <div class="panel">
            <div class="panel-header clearfix">
                <h3 class="pull-left">文章列表</h3>
                <div class="pull-right">
                    <button id="addArticleBtn" class="button button-small button-primary">添加文章</button>
                </div>
            </div>
            <div class="panel-body" id="grid">
                <form tabindex="0" class="form-horizontal" id="searchForm">
                    <div class="row-fluid show-grid">
                        <div class="span5 span-first">
                            <label class="control-label control-label-auto">文章标识：</label>
                            <div class="controls" style="height: 30px">
                                @Html.HiddenFor(x => x.Searcher.AClass)
                                @Html.TextBoxFor(x => x.Searcher.Title, new { @class = "input-small" })
                            </div>
                        </div>
                        <div class="span7">
                            <label class="control-label control-label-auto">文章标题：</label>
                            <div class="controls" style="height: 30px">
                                @Html.TextBoxFor(x => x.Searcher.AKey, new { @class = "input-normal" })
                            </div>
                        </div>
                        <div class="span9" style="">
                            <label class="control-label control-label-auto">创建日期：</label>
                            <div class="controls" style="height: 30px">
                                @Html.TextBoxFor(x => x.Searcher.StartDate, new { @class = "calendar" }) - @Html.TextBoxFor(x => x.Searcher.EndDate, new { @class = "calendar" })
                            </div>
                        </div>
                        <div class="span3">
                            <button class="button button-small" id="btnSearch" type="submit">搜索</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var dialog = null;
    var treeStore = null;
    var tree = null;
    var gridStore = null;
    var grid = null;

    function AddClass() {
        dialog = new BUI.Overlay.Dialog({
            title: '文章管理->添加分类',
            width: 580,
            closeAction: 'destroy',
            height: 290,
            buttons: [],
            bodyStyle: { 'padding': '0px' },
            bodyContent: '<iframe frameborder="0"  style="width:570px;height:180px" src="/Admin/Article/AddClass"></iframe>'
        });
        dialog.show();
    }
    function EditClass() {
        var selected = tree.getSelected();
        if (selected == null) {
            alert('请选择分类！');
            return false;
        }
        dialog = new BUI.Overlay.Dialog({
            title: '文章管理->编辑分类',
            width: 580,
            closeAction: 'destroy',
            height: 290,
            buttons: [],
            bodyStyle: { 'padding': '0px' },
            bodyContent: '<iframe frameborder="0" style="width:570px;height:180px" src="/Admin/Article/EditClass?id=' + selected.id + '"></iframe>'
        });
        dialog.show();
    }
    function CloseWin() {
        dialog.close();
    }
    function DelClass() {
        var selected = tree.getSelected();
        if (selected == null) {
            alert('请选择分类！');
            return false;
        }
        if (confirm('确认删除？')) {
            $.ajax({
                type: 'post',
                url: '/Admin/Article/DeleteClass',
                data: { id: selected.id },
                success: function (res) {
                    treeStore.load({ id: "" });
                }
            });
        }
    }
    function SubmitSuccess() {
        CloseWin();
        $('#searchForm').submit();
    }
    function SubmitClassCuccess(reloadID) {
        CloseWin();
        treeStore.load({ id: reloadID });
    }
    function EditArticle(id) {
        location.href = "/Admin/Article/Edit/" + id;
    }
    function DeleteArticle(id) {
        if (confirm('确认删除？')) {
            $.ajax({
                type: 'post',
                url: '/Admin/Article/Delete',
                data: { id: id },
                success: function (res) {
                    if (res == 'true') {
                        $('#btnSearch').trigger('click');
                    }
                }
            })
        }
    }
    $('#addArticleBtn').click(function () {
        location.href = "/Admin/Article/Add";
    })
    $('#searchForm').on('submit', function (ev) {
        ev.preventDefault();
        var obj = BUI.FormHelper.serializeToObject($(this));
        obj.pageIndex = 0;
        obj.start = 0;
        gridStore.load(obj);
    });
    BUI.use(['bui/calendar', 'bui/tree', 'bui/data', 'bui/toolbar', 'bui/overlay', 'bui/grid'], function (Calendar, Tree, Data, Toolbar, Overlay, Grid) {
        //日期控件
        var _datePicker = new Calendar.DatePicker({
            trigger: '.calendar',
            autoRender: true
        });
        //左侧分类上工具栏
        var _toolbar = new Toolbar.Bar({
            elCls: 'button-group',
            multipleSelect: true,
            defaultChildCfg: {
                elCls: 'button button-small',
                selectable: true
            },
            children: [
              { content: '<i class="icon icon-plus"></i>', id: 'addBtn', handler: AddClass, elAttrs: { title: '增加' } },
              { content: '<i class="icon icon-edit"></i>', id: 'editBtn', handler: EditClass, elAttrs: { title: '编辑' } },
              { content: '<i class="icon icon-remove"></i>', id: 'delBtn', handler: DelClass, elAttrs: { title: '删除' } }
            ],
            render: '#tbar'
        });
        _toolbar.render();
        //分类树数据源
        treeStore = new Data.TreeStore({
            url: '/Admin/Article/AjaxGetClass',
            autoLoad: true
        });
        //分类树
        tree = new Tree.TreeList({
            render: '#ArtTree',
            showLine: true,
            height: 300,
            store: treeStore
        });
        tree.render();
        tree.on('itemclick', function (ev) {
            if (!ev.item.id)
                return false;
            $('#Searcher_AClass').val(ev.item.id);
            $('#btnSearch').trigger('click');
        });
        //文章列表数据源
        gridStore = new Data.Store({
            url: '/Admin/Article/AjaxGetList',
            proxy: {
                limitParam: 'pageSize',
                method: 'post'
            },
            autoLoad: true,
            pageSize: 10
        }),
        grid = new Grid.Grid({
            render: '#grid',
            loadMask: true,
            forceFit: true,
            plugins: [Grid.Plugins.AutoFit],
            columns: [
                { title: '文章标识', width: 80, sortable: false, dataIndex: 'AKey' },
                { title: '文章标题', width: 400, sortable: false, dataIndex: 'Title' },
                { title: '创建时间', width: 150, sortable: false, dataIndex: 'CreateTime' },
                { title: '状态', width: 80, sortable: false, dataIndex: 'Status' },
                {
                    title: '操作', width: 80, sortable: false, dataIndex: 'ID',
                    renderer: function (value, obj) {
                        return '<span class="grid-command" onclick="EditArticle(\'' + value + '\')">编辑</span><span class="grid-command" onclick="DeleteArticle(\'' + value + '\')" >删除</span>';
                    }
                }
            ],
            store: gridStore,
            bbar: {
                pagingBar: true
            }
        });
        grid.render();
    })
</script>
